<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>班级管理</title>
    <link rel="stylesheet" href="{{ url_for('static', filename='css/style.css') }}">
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
    <style>
        body {
            margin: 0;
            height: 100vh;
            display: flex;
            font-family: Arial, sans-serif;
        }
        .sidebar {
            width: 200px;
            background-color: #1E3A5F;
            color: white;
            padding: 20px;
            box-sizing: border-box;
            height: 100vh;
        }
        .sidebar h4 {
            font-weight: 300;
            margin-bottom: 20px;
        }
        .sidebar .nav-link {
            color: white;
            padding: 10px 0;
            text-decoration: none;
            display: block;
        }
        .sidebar .nav-link:hover {
            background-color: #3B5998;
        }
        .main-content {
            flex-grow: 1;
            background-color: #f8f9fa;
            display: flex;
            justify-content: center;
            align-items: flex-start;
            padding: 40px;
        }
        .container {
            width: 100%;
            max-width: 800px;
            background-color: white;
            padding: 30px;
            box-sizing: border-box;
            text-align: center;
            border-radius: 8px;
            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
        }
        h1 {
            margin-bottom: 20px;
            font-weight: 300;
            color: #343a40;
            font-size: 1.8rem;
        }
        table {
            width: 100%;
            margin-bottom: 20px;
        }
        table th, table td {
            text-align: left;
            padding: 10px;
        }
    </style>
</head>
<body>
    <!-- 左侧导航栏 -->
    <div class="sidebar">
        <h4>教师控制台</h4>
        <a href="{{ url_for('create_exam', username=username) }}" class="nav-link">创建考试</a>
        <a href="{{ url_for('manage_class', username=username) }}" class="nav-link">管理班级</a>
        <a href="{{ url_for('login') }}" class="nav-link">退出登录</a>
    </div>

    <!-- 右侧主要内容区域 -->
    <div class="main-content">
        <div class="container">
            <h1 class="text-center">班级管理: {{ class_name }}</h1>
            <table class="table table-striped mt-3">
                <thead>
                    <tr>
                        <th scope="col">学生姓名</th>
                        <th scope="col">学号</th>
                        <th scope="col">操作</th>
                    </tr>
                </thead>
                <tbody>
                    {% for student in students %}
                        <tr>
                            <td>{{ student.username }}</td>
                            <td>{{ student.id }}</td>
                            <td>
                                <form method="POST" action="{{ url_for('delete_student', student_id=student.id, class_name=class_name) }}" onsubmit="return confirm('确定要删除该学生吗?');">
                                    <button type="submit" class="btn btn-danger btn-sm">删除</button>
                                </form>
                            </td>
                        </tr>
                    {% endfor %}
                </tbody>
            </table>
            <a href="{{ url_for('teacher_dashboard', username=session.get('username')) }}" class="btn btn-secondary w-100 mt-3">返回教师主页</a>
        </div>
    </div>
</body>
</html>
